<link rel="stylesheet" href="ccay/example/demo.css"  type="text/css" />
<script type="text/javascript" src="ccay/example/demo.js" charset="utf-8"></script>
<script type="text/javascript" src="ccay/example/baseFunction/dataFormat.js" charset="utf-8"></script>

<div id="dataFormatDemo">
    <div title='API' tabid='tab1'>
        <h3 style="padding-bottom:10px">系统中数据之间可相互转换，以下是各类型数据之间的转换的方法：</h3>
	    <form class="ccay-form" >
		<div id='tmpl' class="ccay-form-custom ccay-form-custommore">
			<ul class="ccay-tmpl">			
			<li class="ccay-form-row">
				 <samp>1,数字格式化(Number)</samp>
				 <span class='ccay-form-input'>
				 <div class="ccay-form-custom ccay-form-custommore">
				  <ul>
					  <li class="ccay-form-row">
					 	<samp>To Date</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toDate(num_Date).format() 如：num_Date:1342862225000
						</span>
					 </li>
		
		 			<li class="ccay-form-row">
					 	<samp>To DateTime</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toDateTimeStr(num_Date) 如：num_Date:1342862225000
						</span>
					 </li>
		
		 			<li class="ccay-form-row">
					 	<samp>To Integer</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toInt(num_Decimal) 如：num_Decimal:123456.789
						</span>
					 </li>
		
					  <li class="ccay-form-row">
					 	<samp>To Decimal</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toDecimal(num_Decimal) 如：num_Decimal:123456.789
						</span>
					 </li>
		
					<li class="ccay-form-row">
					 	<samp>To Currency</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toCurrency(num_Decimal) 如：num_Decimal:123456.789
						</span>
					 </li>
		
					<li class="ccay-form-row">
					 	<samp>To File Size</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toFileSize(num_FileSize) 如：num_FileSize:457892333
						</span>
					 </li>
		
				 </ul>
				 </div>
				 </span>
			 </li> 
			<li class="ccay-form-row">
				 <samp>2，字符串格式化(String)</samp>
				 <span class='ccay-form-input'>
				 <div class="ccay-form-custom ccay-form-custommore">
				  <ul>
					  <li class="ccay-form-row">
					 	<samp>To Date</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toDateStr(str_Date); 如：str_Date:'2012-12-12'
							<p>Ccay.Format.toDateStr(str_Date1,'MM/dd/yyyy'); 如：str_Date1:'12/12/2012'
						</span>
					 </li>
		 			<li class="ccay-form-row">
					 	<samp>To Date - format</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toDateStr(str_Date1,'MM/dd/yyyy','yyyy-MM-dd') 如：str_Date1:'12/12/2012'
						</span>
					 </li>
					<li class="ccay-form-row">
					 	<samp>To Number</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toNumber(str_Currency) 如str_Currency:'222,333,111.12'
						</span>
					 </li>
					<li class="ccay-form-row">
					 	<samp>Ellipsis String</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toEllipsis(str_Ellipsis) 如：str_Ellipsis:"1234567890123456789012345678901234567890"
						</span>
					 </li>
				 </ul>
				 </div>
				 </span>
			 </li> 
			<li class="ccay-form-row">
				 <samp>3,布尔值格式化(Boolean)</samp>
				 <span class='ccay-form-input'>
				 <div class="ccay-form-custom ccay-form-custommore">
				  <ul>
					  <li class="ccay-form-row">
					 	<samp>To Bool String</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toBoolView(bool_Yes); 如：bool_Yes:1
							Ccay.Format.toBoolView(bool_No); 如：bool_Yes:0
						</span>
					 </li>
		 			<li class="ccay-form-row">
					 	<samp>To Bool Html</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toBoolView(bool_Yes,1)
							<p>Ccay.Format.toBoolView(bool_No,1)
						</span>
					 </li>
				 </ul>
				 </div>
				 </span>
			 </li> 
			<li class="ccay-form-row">
				 <samp>4,日期格式化(Date)</samp>
				 <span class='ccay-form-input'>
				 <div class="ccay-form-custom ccay-form-custommore">
				  <ul>
					  <li class="ccay-form-row">
					 	<samp>To Date String</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toDateStr(date_now); 如：date_now:new Date()
						</span>
					 </li>
		 			<li class="ccay-form-row">
					 	<samp>To Date String</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toDateTimeStr(date_now);
						</span>
					 </li>
					<li class="ccay-form-row">
					 	<samp>To Date Number</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toDateNum(date_now)
						</span>
					 </li>
					<li class="ccay-form-row">
					 	<samp>To Date String</samp>
					 	<span class='ccay-form-input'>
							Ccay.Format.toDateBefore(date_now);
							<p>Ccay.Format.toDateBefore(date_1); 如：date_1:new Date(2012,6,3,15,0,0)
						</span>
					 </li>
				 </ul>
				 </div>
				 </span>
			 </li> 		
			</ul>
		</div>
		</form>
    </div>
    <div title='Demo' tabid='tab2'>
    	<h4><span onclick="Ccay.Common.toggle(this,'#demo1')" style="cursor:pointer;">实例1：数字格式化(Number)</span></h4>
    	<div style='padding-left:30px'>
	    	<div id="demo1" style="display:none">
				<span>1.1 To Date</span>
				<div class="secondLevel">
					<div class='demo'>
					    <span>Ccay.Format.toDate(1342862225000),该结果为："2012-07-21"</span>			    
					</div>
					<div class='demo'>
					    <span>试一试：</span>
					    <input type="text" class="i18n" i18nKey="1342862225000" id="n2Date"/>
					    <span class="ccay-button" onclick="alert(Ccay.Format.toDate($('#n2Date').val()*1).format())">
							<a class="ccay-icon confirm"></a>
							<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
						</span>
					</div>
					<div class="codeArea">
						<pre>Ccay.Format.toDate({Number})</pre>
					</div>
				</div>
				<span>1.2 To DateTime</span>
				<div class="secondLevel">
					<div class='demo'>
					    <span>Ccay.Format.toDateTimeStr(1342862225000),该结果为：2012-07-21 17:17:05"</span>	
					</div>
					<div class='demo'>
					    <span>试一试：</span>
					    <input type="text" class="i18n" i18nKey="1342862225000" id="n2DateTime"/>
					    <span class="ccay-button" onclick="alert(Ccay.Format.toDateTimeStr($('#n2DateTime').val()*1))">
							<a class="ccay-icon confirm"></a>
							<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
						</span>
					</div>
					<div class="codeArea">
						<pre id=JS1_2'>Ccay.Format.toDateTimeStr({Number})</pre>
					</div>
				</div>
				<span>1.3 To Intger</span>
				<div class="secondLevel">
					<div class='demo'>
					    <span>Ccay.Format.toInt(123456.789),该结果为："123456"</span>	
					</div>
					<div class='demo'>
					    <span>试一试：</span>
					    <input type="text" class="i18n" i18nKey="123456.789" id="n2Int"/>
					    <span class="ccay-button" onclick="alert(Ccay.Format.toInt($('#n2Int').val()*1))">
							<a class="ccay-icon confirm"></a>
							<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
						</span>
					</div>
					<div class="codeArea">
						<pre id=JS1_3'>Ccay.Format.toInt({Number})</pre>
					</div>
				</div>
				<span>1.4 To Decimal</span>
				<div class="secondLevel">
					<div class='demo'>
					    <span>Ccay.Format.toDecimal(123456.789),该结果为："123456.79"</span>	
					</div>
					<div class='demo'>
					    <span>试一试：</span>
					    <input type="text" class="i18n" i18nKey="123456.789" id="n2Decimal"/>
					    <span class="ccay-button" onclick="alert(Ccay.Format.toDecimal($('#n2Decimal').val()*1))">
							<a class="ccay-icon confirm"></a>
							<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
						</span>
					</div>
					<div class="codeArea">
						<pre id=JS1_4'>Ccay.Format.toDecimal({Number})</pre>
					</div>
				</div>
				<span>1.5 To Currency</span>
				<div class="secondLevel">
					<div class='demo'>
					    <span>Ccay.Format.toCurrency(123456.789),该结果为："123,456.789"</span>	
					</div>
					<div class='demo'>
					    <span>试一试：</span>
					    <input type="text" class="i18n" i18nKey="123456.789" id="n2Currency"/>
					    <span class="ccay-button" onclick="alert(Ccay.Format.toCurrency($('#n2Currency').val()*1))">
							<a class="ccay-icon confirm"></a>
							<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
						</span>
					</div>
					<div class="codeArea">
						<pre id=JS1_5'>Ccay.Format.toCurrency({Number})</pre>
					</div>
				</div>
				<span>1.6 To File Size</span>
				<div class="secondLevel">
					<div class='demo'>
					    <span>Ccay.Format.toFileSize(457892333),该结果为："436.68M"</span>	
					</div>
					<div class='demo'>
					    <span>试一试：</span>
					    <input type="text" class="i18n" i18nKey="457892333" id="n2FileSize"/>
					    <span class="ccay-button" onclick="alert(Ccay.Format.toFileSize($('#n2FileSize').val()*1))">
							<a class="ccay-icon confirm"></a>
							<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
						</span>
					</div>
					<div class="codeArea">
						<pre id=JS1_6'>Ccay.Format.toFileSize({Number})</pre>
					</div>
				</div>	
	         </div>
	       </div>  
        <h4><span onclick="Ccay.Common.toggle(this,'#demo2')" style="cursor:pointer;">实例2：字符串格式化(String)</span></h4>
        <div style='padding-left:30px'>
        <div id="demo2" style="display:none">
        	<span>2.1 To Date</span>
        	<div class="secondLevel">
				<div class='demo'>
				    <span>Ccay.Format.toDateStr('2012-12-12'),该结果为：date对象</span>			    
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" class="i18n" i18nKey="2012-12-12" id="s2Date1"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toDateStr($('#s2Date1').val()))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class='demo'>
				    <span>Ccay.Format.toDateStr('12/12/2012','MM/dd/yyyy'),该结果为：date对象</span>			    
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" class="i18n" i18nKey='12/12/2012' id="s2Date2"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toDate($('#s2Date2').val(),'MM/dd/yyyy'))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class="codeArea">
					<pre>Ccay.Format.toDateStr({String});Ccay.Format.toDateStr('2012-12-12','MM/dd/yyyy')</pre>
				</div>
			</div>
			<span>2.2 To Date - format</span>
			<div class="secondLevel">
				<div class='demo'>
				    <span>Ccay.Format.toDateStr('12/12/2012','MM/dd/yyyy','yyyy-MM-dd') ,该结果为：date对象</span>			    
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" class="i18n" i18nKey="12/12/2012" id="s2DateF"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toDateStr($('#s2DateF').val(),'MM/dd/yyyy','yyyy-MM-dd'))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class="codeArea">
					<pre>Ccay.Format.toDateStr({String},'MM/dd/yyyy','yyyy-MM-dd')</pre>
				</div>
			</div>
			<span>2.3 To Number</span>
			<div class="secondLevel">
				<div class='demo'>
				    <span>Ccay.Format.toNumber('222,333,111.12') ,该结果为：222333111.12</span>			    
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" class="i18n" i18nKey="222,333,111.12" id="s2Num"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toNumber($('#s2Num').val()))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class="codeArea">
					<pre>Ccay.Format.toNumber({String})</pre>
				</div>
			</div>
			<span>2.4 To Ellipsis String</span>
			<div class="secondLevel">
				<div class='demo'>
				    <span>Ccay.Format.toEllipsis('1234567890123456789012345678901234567890'),超出区域的效果为...,该结果为：<label title="1234567890123456789012345678901234567890" class="ccay-Text-Ellipsis">1234567890123456789012345...</label>	</span>    
				</div>
				
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" class="i18n" i18nKey="1234567890123456789012345678901234567890" id="s2E"/>
				    <span class="ccay-button" onclick="Ccay.example.baseFunction.dataFormat.test()">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div id='tmpl' class="ccay-form-body">
		        <ul>
					<li class="ccay-form-row">
					 	<samp>效果</samp>
					 	<span class='ccay-form-input' id='result'>
						</span>
					 </li>
				</ul>
				</div>	 
				<div class="codeArea">
					<pre>Ccay.Format.toEllipsis({String})</pre>
				</div>
			</div>				
        </div>
        </div>
        <h4><span onclick="Ccay.Common.toggle(this,'#demo3')" style="cursor:pointer;">实例3：布尔值格式化(Boolean)</span></h4>
        <div style='padding-left:30px'>
        <div id="demo3" style="display:none">       			
			<span>3.1 To Bool String</span>
			<div class="secondLevel">
				<div class='demo'>
				    <span>Ccay.Format.toBoolView(true)&Ccay.Format.toBoolView(false),该结果分别为：是和否</span>			    
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" class="i18n" i18nKey="1" id="b2S1"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toBoolView($('#b2S1').val()*1))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class='demo'>	
				    <span>试一试：</span>		    
				    <input type="text" class="i18n" i18nKey="0" id="b2S2"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toBoolView($('#b2S2').val()*1))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class="codeArea">
					<pre>Ccay.Format.toBoolView({boolean})</pre>
				</div>
            </div>
            <span>3.2 To Bool Html</span>
            <div class="secondLevel">
				<div class='demo'>
				    <span>Ccay.Format.toBoolView(true,1) Ccay.Format.toBoolView(false,1) ,该结果分别为：html标签<a class='ccay-icon yes nocursor' title='是'></a>和<a class='ccay-icon no nocursor' title='否'></a></span>			    
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" class="i18n" i18nKey="1" id="b2b1"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toBoolView($('#b2b1').val()*1,1))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" class="i18n" i18nKey="0" id="b2b2"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toBoolView($('#b2b2').val()*1,1))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class="codeArea">
					<pre>Ccay.Format.toBoolView({boolean},1)</pre>
				</div>
             </div>
        </div> 
        </div>       
        <h4><span onclick="Ccay.Common.toggle(this,'#demo4')" style="cursor:pointer;">实例4：日期格式化(Date)</span></h4>
        <div style='padding-left:30px'>
        <div id="demo4" style="display:none">
            <span>4.1 To Date String</span>
            <div class="secondLevel">
				<div class='demo'>
				    <span>Ccay.Format.toDateStr(date); 如：date:new Date() ,该结果为：日期字符串</span>			    
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" id='d2s1' class="init ccay-calendar" format="datetime"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toDateStr(Ccay.Format.toDate($('#d2s1').ccayGetValue())))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class="codeArea">
					<pre>Ccay.Format.toDateStr({date})</pre>
				</div>
			</div>
			<span>4.2 To Date String</span>
			<div class="secondLevel">
				<div class='demo'>
				    <span>Ccay.Format.toDateTimeStr(date); 如：date:new Date() ,该结果为：日期字符串</span>			    
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" id='d2s2' class="init ccay-calendar" format="datetime"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toDateTimeStr(Ccay.Format.toDate($('#d2s2').ccayGetValue())))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class="codeArea">
					<pre>Ccay.Format.toDateTimeStr({date})</pre>
				</div>
			</div>
			<span>4.3 To Date Number</span>
			<div class="secondLevel">
				<div class='demo'>
				    <span>Ccay.Format.toDateNum(date), 如：date:new Date() ,该结果为：日期数字</span>			    
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" id='d2N' class="init ccay-calendar" format="datetime"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toDateNum(Ccay.Format.toDate($('#d2N').ccayGetValue())))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class="codeArea">
					<pre>Ccay.Format.toDateNum({date})</pre>
				</div>
			</div>
			<span>4.4 To Date String</span>
			<div class="secondLevel">
				<div class='demo'>
				    <span>Ccay.Format.toDateBefore(date)，该结果为：日期字符串，如：刚刚; 07月03日 15:00; </span>			    
				</div>
				<div class='demo'>
				    <span>试一试：</span>
				    <input type="text" id='d2S3' class="init ccay-calendar" format="datetime"/>
				    <span class="ccay-button" onclick="alert(Ccay.Format.toDateBefore(Ccay.Format.toDate($('#d2S3').ccayGetValue())))">
						<a class="ccay-icon confirm"></a>
						<label class="i18n" i18nKey="ccay.grid.test.conversion"></label>
					</span>
				</div>
				<div class="codeArea">
					<pre>Ccay.Format.toDateBefore({date})</pre>
				</div>
			<div class="secondLevel">
        </div>
        </div>
    </div>
  </div>
 </div>
</div>